:root {
  --color-bg-dark: rgb(24, 24, 28);
  --color-bg-dark-0: rgb(12, 12, 12);
  --color-bg-dark-1: #1e1e1f;
  --color-bg-dark-2: #232324;
  --color-bg-dark-3: #343434;
  --color-border-dark: rgba(255, 255, 255, 0.1);
  --color-shadow-dark: rgba(255, 255, 255, 0.6);
  --color-shadow-purple: rgba(255, 255, 255, 0.6);
}
::-webkit-scrollbar {
  display: none;
}
a {
  font-weight: 500;
  color: #646cff;
  text-decoration: inherit;
}
a:hover {
  color: #535bf2;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: 微软雅黑;
  font-size: 14px;
  /* 兼容 iOS < 11.2 */
  padding-top: constant(safe-area-inset-top);
  padding-left: constant(safe-area-inset-left);
  padding-right: constant(safe-area-inset-right);
  padding-bottom: constant(safe-area-inset-bottom);
  /* 兼容 iOS >= 11.2 */
  padding-top: env(safe-area-inset-top);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
  padding-bottom: env(safe-area-inset-bottom);
}

@supports (bottom: constant(safe-area-inset-bottom)) or
  (bottom: env(safe-area-inset-bottom)) {
  #app {
    margin-bottom: constant(safe-area-inset-bottom);
    margin-bottom: env(safe-area-inset-bottom);
  }
}

@media (prefers-color-scheme: light) {
  :root {
    color: #213547;
    background-color: #ffffff;
  }
  a:hover {
    color: #747bff;
  }
  button {
    background-color: #f9f9f9;
  }
}
